import React, { PureComponent } from 'react';
import { connect } from 'react-redux'
import PropTypes from 'prop-types'
import './index.less'
import Arrow from '../../../../../common/Arrow';

class DataMenu extends PureComponent {

  static propTypes = {
    dataMenu: PropTypes.object
  }

  render () {
    const { dataMenu } = this.props
    return (
      <ul className="dataMenu" style={{ display: dataMenu.visible? 'block': 'none', left: dataMenu.x, top: dataMenu.y }}>
        <li>
          查看
          <Arrow direct="right" color="rgba(3, 8, 26,.6)" size={4}/>
          <ul className="subDataMenu">
            <li>
              <span/>
              列表
            </li>
            <li>缩略图</li>
          </ul>
        </li>
        <li>
          排序方式
          <Arrow direct="right" color="rgba(3, 8, 26,.6)" size={4}/>
          <ul className="subDataMenu">
            <li>
              <span/>
              名称
            </li>
            <li>大小</li>
            <li>修改时间</li>
          </ul>
        </li>
        <li>
          刷新
        </li>
        <li>
          重新加载页面
        </li>
        <li>
          会员中心
        </li>
      </ul>
    );
  }
}

export default connect(
  (state) => ({
    dataMenu: state.dataMenu
  })
)(DataMenu);
